<template>
  <div class="frame-container no-drag">
    <i @click="minitab" class="iconfont icon-zuixiaohua"></i>
    <i @click="fullscreen" class="iconfont icon-zuidahua"></i>
    <i @click="close" class="close iconfont icon-guanbi"></i>
  </div>
</template>

<script setup>
import { ref } from 'vue'
const ipcRenderer = window.electron.ipcRenderer

const minitab = () => {
  ipcRenderer.send('min-app')
}
const fullscreen = () => {
  ipcRenderer.send('fullscreen-app')
}
const close = () => {
  ipcRenderer.send('close-app')
}
</script>
<style lang="less" scoped>
.frame-container {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  i {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    width: 35px;
    font-size: 11px;
    font-weight: bold;
    cursor: pointer;
    &:hover {
      background-color: #e2e2e2;
    }
    &.close:hover {
      color: #fff;
      background-color: #fb7373;
    }
  }
}
</style>
